﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Index
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="FeaturedContent" runat="server">
    <link href="<%: Url.Content("~/Scripts/media/css/demo_table_jui.css")%>" rel="stylesheet"
        type="text/css" />
    <script src='<%: Url.Content("~/Scripts/jquery.timeentry.js") %>' type="text/javascript"></script>
    <br />
    <div style="width: 100%">
        <div style="float: left; width: 55%; height: 100%">
            <table width="80%" id="tblwaste">
                <tr>
                    <td colspan="2" class="head cell" style="height: 38px">
                        <h3>
                            LOSS</h3>
                    </td>
                </tr>
                <tr class="rowb">
                    <td class="head cell" style="width: 200px">
                        DATE
                    </td>
                    <td class="cell desc" id="wDate">
                        <span style="width:300px; text-align:left;">  <%: WinNemoLib.DateUtil.ToDisplayDate(TireBias.Models.SessionBag.Current.curdate, WinNemoLib.DateUtil.eLanguage.EN)%></span>
                    </td>
                </tr>
                <tr class="rowb">
                    <td class="head cell" style="width: 200px">
                        BIAS NO
                    </td>
                    <td class="cell desc" id="wBiasno">
                        <span style="width:300px; text-align:left;">  <%: TireBias.Models.SessionBag.Current.biasno  %></span>
                    </td>
                </tr>
                <tr class="rowb">
                    <td class="head cell" style="width: 200px">
                        Shift
                    </td>
                    <td class="cell desc" id="wShift">
                         <span style="width:300px; text-align:left;"> <%: TireBias.Models.SessionBag.Current.shift %></span>
                    </td>
                </tr>
                <tr class="rowb">
                    <td class="head cell" style="width: 200px">
                        TopCode</td>
                    <td class="cell desc" id="lsTopcord">
                    <span style="width:300px; text-align:left;">  <%:TireBias.Models.SessionBag.Current.tirecode %></span></td>
                </tr>
                <tr class="rowb">
                    <td class="head cell" style="width: 200px">
                        Lot</td>
                    <td class="cell desc" id="lsLot"  >
                       <span style="width:300px; text-align:left;"> <%:  TireBias.Models.SessionBag.Current.toplot %></span></td>
                </tr>
                <tr class="rowb">
                    <td class="head cell" style="width: 200px">
                        Roll</td>
                    <td class="cell desc" id="lsRoll">
                         <span style="width:300px; text-align:left;"> <%: TireBias.Models.SessionBag.Current.toproll%></span></td>
                </tr>
                <tr class="rowa">
                    <td class="head cell" style="width: 200px">
                        TIME LOSS
                    </td>
                    <td id="timeFrom" class="cell desc" style="width: 500px">
                        <div style="float: left;">
                            <input id="txttimeFrom" class="timeRange" type="text" style="width: 110px;" /></div>
                        <div style="float: left;">
                            -&nbsp;
                            <input id="txttimeTo" class="timeRange" type="text" style="width: 110px;" /></div>
                    </td>
                </tr>
                <tr class="rowa">
                    <td class="head cell" style="width: 200px">
                        CODE LOSS
                    </td>
                    <td class="cell desc">
                        <div style="float: left; text-align: left; width: 400px;">
                            <input type="text" id="txtreason" style="width: 50px; text-align: center;" readonly="readonly" />&nbsp;<span
                                class="fontTH" id="sTxt"></span>
                        </div>
                    </td>
                </tr>
                <tr class="rowa">
                    <td class="head cell" style="width: 200px">
                        TEXT
                    </td>
                    <td class="cell desc">
                        <input type="text" id="txtMsg" class="auto" />
                    </td>
                </tr>
                <tr>
                    <td class="style1">
                        &nbsp;
                    </td>
                    <td>
                        <button id="save" class="btn" style="width: 220px; color: Black;">
                            Save</button>
                        <button id="cancel" class="btn" style="width: 220px; color: Black;">
                                Cancel</button>
                    </td>
                </tr>
            </table>
        </div>
        <div style="width: 40%; margin-right: 5%; float: right;">
            <table id="dataTbl" class="display">
                <thead>
                    <tr>
                      
                        <th>
                            CODE
                        </th>
                        <th>
                            START
                        </th>
                        <th>
                            END
                        </th> 
                        <th>
                            LOSS
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
    <div id="dialog-code" title="ชนิดของLOSS">
        <table id="tbl" width="98%">
            <thead>
                <tr>
                    <td class="head cell">
                        CODE
                    </td>
                    <td class="head cell">
                        DESC
                    </td>
                </tr>
                <tr id="trHd" class="hide">
                    <td class="head cell">
                    </td>
                    <td class=" cell">
                    </td>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="TableContent" runat="server">
</asp:Content>
<asp:Content ID="Content5" ContentPlaceHolderID="ScriptsSection" runat="server">
    <script src="<%: Url.Content("~/Scripts/jquery.dataTables.js")%>" type="text/javascript"></script>
    <script src="<%: Url.Content("~/Scripts/media/js/jquery-ui.js")%>" type="text/javascript"></script>
    <script src='<%: Url.Content("~/Scripts/autoNumeric.js") %>' type="text/javascript"></script>
    <script src='<%: Url.Content("~/Scripts/jquery.metadata.js") %>' type="text/javascript"></script>
    <style type="text/css">
        .hide
        {
            display: none;
        }
        #tblwaste input[type="text"], input[type="password"]
        {
            height: 43px;
            font-size: 30px;
            margin-left: 5px;
        }
        #tblwaste .cell
        {
            line-height: 50px !important;
            font-weight: bolder;
            padding: 0px !important;
            text-align: center;
        }
        .style1
        {
            width: 108px;
        }
        #tbl .rowa, #tbl .rowb
        {
            height: 45px;
        }
        #tbl .rowa:hover, #tbl .rowb:hover
        {
            cursor: pointer;
            color: Red;
        }
    </style>
    <script type="text/javascript">

        var gTable;
        function getList() {
            gTable = $('#dataTbl').dataTable({
                bAutoWidth: false,
                bInfo: true,
                bFilter: true,
                bSort: false,
                bProcessing: false,
                bServerSide: true,
                bPaginate: true,
                bDestroy: true,

                bJQueryUI: true,
                sPaginationType: "full_numbers",
                iDisplayLength: 20,
                aLengthMenu: [20, 40, 80, 100],
                "sAjaxSource": '<%= Url.Action("List_LOSS") %>',
                aoColumns: [
                   { "sWidth": "50px" } , { "sWidth": "200px" }, { "sWidth": "140px" }, { "sWidth": "140px" }

                      ]
                , fnRowCallback: function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {


                    //                          var index = gTable.fnPagingInfo().iStart + iDisplayIndex + 1;
                    //                          $('td:eq(0)', nRow).html(index);
                    $(nRow).find("td").addClass("cell");



                    $(nRow).click(function (event) {
                        selected = new Array();
                        $("#dataTbl tr.actived").removeClass('actived');
                        $(this).addClass('actived');
                        var iPos = gTable.fnGetPosition(this);
                        var aData;
                        if (iPos != null) {
                            aData = gTable.fnGetData(iPos);
                            if (jQuery.inArray(aData[0], selected) != -1)
                                $(this).addClass('actived');
                        }
                        aData = gTable.fnGetData(iPos);

                        var iId = $("td:first", nRow).text();

                        //                              is_in_array = jQuery.inArray(iId, selected);
                        //                              if (is_in_array == -1) {
                        //                                  selected[selected.length] = iId;
                        //                              }
                        //                              else {
                        //                                  selected = jQuery.grep(selected, function (value) {
                        //                                      return value != iId;
                        //                                  });
                        //                              }


                    });

                },
                "fnDrawCallback": function (oSettings) {

                    $('#dataTbl tr').each(function () {
                        var iPos = gTable.fnGetPosition(this);
                        if (iPos != null) {
                            var aData = $("td:first", $(this)).text();

                            //                            if (jQuery.inArray(aData, selected) != -1)
                            //                                $(this).addClass('actived');
                        }

                    });
                }


            });
        }

        $(function () {
            $('.timeRange').timeEntry({ show24Hours: true, beforeShow: customRange });
            function customRange(input) {
                return { minTime: (input.id == 'timeTo' ?
             $('#txttimeFrom').timeEntry('getTime') : null),
                    maxTime: (input.id == 'timeFrom' ?
            $('#txttimeTo').timeEntry('getTime') : null)
                };
            }

            $("#dialog-code").dialog({
                width: 500,
                height: 800,
                position: {
                    my: 'center',
                    at: 'center',
                    of: $('#dataTbl')
                },
                autoOpen: false,
                show: "blind",
                open: function (event, ui) {

                }
            });
            getList();
            $('#txtreason').on('click focusin', function () {

                $("#dialog-code").dialog("open");
            });


            $("#txtreason").setMask("99").addClass("right");
            $("#txtcode").change(function () {
                $(this).val($(this).val().toUpperCase())
            });
            $("#drop").addClass("hide");

            $("#save").button({
                text: true
            }).click(function () {
                var code = "";
                var timeFr = $("#txttimeFrom").timeEntry('getTime');
                var timeTo = $("#txttimeTo").timeEntry('getTime');
                reason = $("#txtreason").val();

                if (timeFr == null) {
                    alert("ระบุค่าไม่ครบ"); $("#txttimeFrom").focus();
                    return;
                }
                if (timeTo == null) {
                    alert("ระบุค่าไม่ครบ"); $("#txttimeTo").focus();
                    return;
                }

                if (reason == "") {
                    alert("ระบุค่าไม่ครบ"); $("#txtreason").focus();
                    return;
                }

                if (timeFr > timeTo) {
                    alert("ช่วงเวลาไม่ถูกต้อง");
                    return;
                }


                var dFr = $("#wDate").text() + (timeFr.getHours() < 10 ? ' 0' : ' ') + timeFr.getHours() + (timeFr.getMinutes() < 10 ? ':0' : ':') + timeFr.getMinutes() + ':00';
                var dTo = $("#wDate").text() + (timeTo.getHours() < 10 ? ' 0' : ' ') + +timeTo.getHours() + (timeTo.getMinutes() < 10 ? ':0' : ':') + timeTo.getMinutes() + ':00';

                $.post('<%= Url.Action("Get_Validate")%>' + '?timefr=' + dFr + '&timesec=' + dTo
                + '&reasoncode=' + reason, function (data) {
                    if (data.success == 0) {
                        alert(data.message);
                    } else {
                        var getUsersUrl = '<%=Url.Action("INS_LOSS_DATA") %>';
                        var act = '<%=Url.Action("index") %>' + '?biasno=' + $("#wBiasno").text();

                        callScriptMethod(getUsersUrl, {
                            thedata: {
                                _Biasno: $("#wBiasno").text(),
                                _Empname: '<%: User.Identity.Name.ToString() %>',
                                _Text: $("#txtMsg").val(),
                                _Reason: $("#txtreason").val(),
                                _Start: (timeFr.getHours() < 10 ? '0' : '') + timeFr.getHours() + (timeFr.getMinutes() < 10 ? ':0' : ':') + timeFr.getMinutes() + ':00',
                                _End: (timeTo.getHours() < 10 ?  '0' : '') + timeTo.getHours() + (timeTo.getMinutes() < 10 ? ':0' : ':') + timeTo.getMinutes() + ':00',
                                _Lsdate: $("#wDate").text(),
                                _Shift: $("#wShift").text(),
                                _Topcode: $.trim($("#lsTopcord").text()),
                                _Tcrcdlot: $.trim($("#lsLot").text()),
                                _Toproll: $.trim($("#lsRoll").text())
                            }
                        }, act)
                    }
                });
            });

            $("#cancel").button({
                text: true
            }).click(function () {
                var nextURL = '<%=  ViewBag.Return %>';

                window.location = nextURL;
            });

            function refreshTable(oTable) {
                table = oTable.dataTable();
                oSettings = table.fnSettings();

                //Retrieve the new data with $.getJSON. You could use it ajax too
                $.getJSON(oSettings.sAjaxSource, null, function (json) {
                    table.fnClearTable(this);

                    for (var i = 0; i < json.aaData.length; i++) {
                        table.oApi._fnAddData(oSettings, json.aaData[i]);
                    }

                    oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
                    table.fnDraw();
                });
            }

            function Load_Master() {
                $.post('<%=Url.Action("Get_Detail","BIASLOSS") %>'
                    , function (data) {
                        $("#tbl tbody").empty();
                        for (i = 0; i < data.length; i++) {

                            var row = "rowb";
                            if (i % 2 == 0) {
                                row = "rowa";
                            }
                            var $tr = $("#trHd").clone();
                            $tr.removeClass("hide").removeAttr("id").addClass(row).addClass("prob");
                            if (i == 0) {
                                $tr.addClass("actived");
                            }
                            $("td:eq(0)", $tr).text(data[i]._code).addClass("text-center");
                            $("td:eq(1)", $tr).text(data[i]._desc);

                            $tr.appendTo($("#tbl tbody"));
                        }
                    }); //post
            }
            Load_Master();
            $(".prob").live("click", function () {
                $("#txtreason").val($(this).find("td:first").text());
                $("#sTxt").text($(this).find("td:last").text());
                $("#dialog-code").dialog("close");
            });
            function callScriptMethod(url, jsonObject, action, callback, async) {

                callback = callback || function () { };
                async = (async == null || async);

                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: url,
                    data: JSON.stringify(jsonObject),
                    dataType: "json",
                    async: async,
                    success: function (data) {
                        alert(data.message);
                        if (data.success != "0") {
                            $("#txtqty").val("");
                            $("#txtreason").val("");
                            $("#txtcode").val("");
                            $("#txtlot").val("");
                            refreshTable(gTable);
                            //window.location = action;
                        }
                    },
                    error: function (xhr, status, error) {
                        var err = xhr.responseText;
                        alert(err.Message);
                    }
                });
            }

        });
    </script>
</asp:Content>
